<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head th:include="header::header"></head>
<head>
    <meta charset="UTF-8">
    <title>普惠商城-个人中心-订单中心-线下订单</title>
    <link rel="stylesheet" th:href="@{/css/paging.css}">
    <link rel="stylesheet" th:href="@{/css/personal-order-Line.css}">
</head>
<body>
<div th:include="commonfragment::order-top-search-nav"></div>
<!--个人中心中间主体框架  -->
<div class="centerbody personal_middle">
    <!-- 左侧通用导航栏 -->
    <div class="personal_middle_nav" th:include="commonfragment::order-left-menu-nav"></div>
    <div class="centerbody personal_middle_main">
        <div class="personal_middle_main_tit">
            <span>订单中心</span>><span>线下订单</span>
        </div>
        <!-- 订单tab标签 -->
        <div data-role="page">
            <div data-role="content-floud">
                <div class="publicBox">
                    <div class="LineTitle clear" id="hear">
                        <!-- <span data-order-status="0">全部</span>-->
                        <span data-order-status="1">已完成</span>
                    </div>
                    <div class="LineCon">
                        <div class="LineList">
                            <table class="TabeCon">
                                <tr>
                                    <th width="80">编号</th>
                                    <th width="200">订单号</th>
                                    <th>商户名称</th>
                                    <th>下单时间</th>
                                    <th>商户电话</th>
                                    <th>订单金额</th>
                                    <th width="120">状态</th>
                                </tr>
                                <tr th:each="order:${orderList}">
                                    <th:block th:object="${order}">
                                        <td th:text="*{id}"></td>
                                        <td th:text="*{orderNo}"></td>
                                        <td th:text="*{merchantName}"></td>
                                        <td th:text="*{createTime}"></td>
                                        <td th:text="*{merchantTel}"></td>
                                        <td th:text="'¥'+*{payMoney}"></td>
                                        <td class="box_small" th:if="*{status}==2">已退货</td>
                                        <td class="box_small" th:if="*{status}==1">已完成</td>
                                    </th:block>
                                </tr>
                            </table><!--列表 over-->
                        </div>
                    </div><!--LineConf-->
                    <!--分页-->
                    <div class="tcdPageCode"></div>
                    <!--分页 over-->
                </div><!--线下订单-->
            </div>
        </div>
        <!-- 全部订单 -->

    </div>
    <div style="clear:both;"></div>
</div>
<!-- 页面底部 -->
<div th:include="footer::footer"></div>
<script th:src="@{/js/jquery.page.js}"></script>
</body>
<script th:inline="javascript">
    $(function () {
        /*tab标签切换*/
        function tabs(tabTit, on, tabCon) {
            $(tabCon).each(function () {
                $(this).children().eq(0).show();
            });
            $(tabTit).children().click(function () {
                $(this).addClass(on).siblings().removeClass(on);
                var index = $(tabTit).children().index(this);
                $(tabCon).children().eq(index).show().siblings().hide();
            });
        }

        tabs(".LineTitle", "Line_on", ".LineCon");
        $(".box1 input:checked").parent().parent().addClass("selected");
        $(".box1 input").change(function () {
            $(".box1 input:checked").parent().parent().addClass("selected").siblings().removeClass("selected");
        });
        $('input.paybutton').eq(0).addClass('choose');

        $('input.paybutton').hover(function () {
            $(this).addClass('choose');
            $(this).siblings().removeClass('choose');
        }, function () {
            $(this).removeClass('choose');
        });
        $('.cancel_small').click(function () {
            $('.shadow').css('display', 'none');
            $('.login_box_2').css('display', 'none');
        });

        $('.add_info').click(function () {
            $('.shadow').css('display', 'block');
            $('.login_box_2').css('display', 'block');
        });
        $('.shadow').css('height', $(window).height());
        $('.login_box_2').css('top', ($(window).height() - $('.login_box_2').height()) / 2);
        $('.login_box_2').css('left', ($(window).width() - $('.login_box_2').width()) / 2);
        $(window).resize(function () {
            $('.shadow').css('height', $(window).height());
            $('.login_box_2').css('top', ($(window).height() - $('.login_box_2').height()) / 2);
            $('.login_box_2').css('left', ($(window).width() - $('.login_box_2').width()) / 2);
        });

        //初始化页卡样式
        var status = [[${status}]];
        $("[data-order-status=" + status + "]").addClass("Line_on");
        $("#hear").find("span").click(function () {
            window.location.href = Common.generateUrl(
                "/shopping/order/findUnlineOrders",
                {
                    "status": $(this).attr("data-order-status")
                }
            );
        });


        /*分页*/
        $(".tcdPageCode").createPage({
            pageCount: Math.ceil([[${count}]] / [[${pageSize}]]),
            current: [[${pageNum}]],
            backFn: function (current) {
                window.location.href = Common.generateUrl(
                    "/shopping/order/findUnlineOrders",
                    {
                        status: $("#hear").find("li.active").attr("data-order-status"),
                        pageNum: current
                    }
                );
            }
        });


    })
</script>

</html>